import React,{memo} from 'react'
import { Button, Form, Image, Input } from 'antd'

function ZhaoHui(props, context){

  const onFinish = (v)=>{}

  const onFinishFailed = (v)=>{}

  const onColset = ()=>{
    console.log(props)
    props.onColset();
  }

  return <>
    <div className="zhuce-main-box">
      <div className="zhuce-title">忘记密码立即找回</div>
      <div className="zhuce-from">
        <Form
          name="from"
          initialValues={{ remember: true }}
          onFinish={onFinish}
          onFinishFailed={onFinishFailed}
          autoComplete="off"
        >
          <Form.Item label="邮箱">
            <Input className="fromItem"  placeholder="登录邮箱" />
          </Form.Item>
          <Form.Item label="验证码" >
            <Input  className="fromItem fromItem2" placeholder="验证码" />
            <Button style={{marginLeft:20}} >发送邮箱验证码</Button>
          </Form.Item>
          <Form.Item label="新密码" >
            <Input className="fromItem" placeholder="登录密码" />
          </Form.Item>
          <Form.Item label="确认新密码" >
            <Input className="fromItem" placeholder="确认密码" />
          </Form.Item>


          <Form.Item  className="button-box" >
            <Button className="form-button">提交</Button>
            <Button onClick={()=>onColset()} className="form-button">取消</Button>
          </Form.Item>


        </Form>
      </div>
    </div>
  </>
}

export default memo(ZhaoHui);
